<template>
  <page-layout>
    <a-row :gutter="[10, 10]">
      <!-- 顶部区域 -->
      <a-col :span="24">
        <a-card>
          <!-- 查询参数 -->
<!--          <pro-query
            :searchParam="searchParam"
            @on-search ="search"
          ></pro-query>-->
        </a-card>
      </a-col>
    </a-row><br>
    <a-tabs type="card" v-model:activeKey="activeKey" @change="change">
      <a-tab-pane key="1" tab="前期与设计">
        <a-col :span="24">
          <a-card>
            <pro-table id="qqysjtable"
              ref="tableRef"
              :columns="columns1"
              :fetch="fetch1"
              :toolbar="toolbar"
              :operate="operate"
              :param="state.param"
              :pagination="pagination"
            >
            </pro-table>
          </a-card>
        </a-col>
      </a-tab-pane>
      <a-tab-pane key="2" tab="建设管理">
        <a-col :span="24">
          <a-card>
            <pro-table
              id="jsgltable"
              ref="tableRef"
              :columns="columns2"
              :fetch="fetch2"
              :toolbar="toolbar"
              :operate="operate"
              :param="state.param"
              :pagination="pagination"
            >
            </pro-table>
          </a-card>
        </a-col>
      </a-tab-pane>
      <a-tab-pane key="3" tab="计划下达与执行">
        <a-col :span="24">
          <a-card>
            <pro-table
              id="jhxdyzxtable"
              ref="tableRef"
              :columns="columns3"
              :fetch="fetch3"
              :toolbar="toolbar"
              :operate="operate"
              :param="state.param"
              :pagination="pagination"
            >
            </pro-table>
          </a-card>
        </a-col>
      </a-tab-pane>
      <a-tab-pane key="4" tab="资金使用与管理">
        <a-col :span="24">
          <a-card>
            <pro-table
              id="zjsyygltable"
              ref="tableRef"
              :columns="columns4"
              :fetch="fetch4"
              :toolbar="toolbar"
              :operate="operate"
              :param="state.param"
              :pagination="pagination"
            >
            </pro-table>
          </a-card>
        </a-col>
      </a-tab-pane>
      <a-tab-pane key="5" tab="质量管理行为">
        <a-col :span="24">
          <a-card>
            <pro-table
              id="zlglxwtable"
              ref="tableRef"
              :columns="columns5"
              :fetch="fetch5"
              :toolbar="toolbar"
              :operate="operate"
              :param="state.param"
              :pagination="pagination"
            >
            </pro-table>
          </a-card>
        </a-col>
      </a-tab-pane>
      <a-tab-pane key="6" tab="实体质量">
        <a-col :span="24">
          <a-card>
            <pro-table
              id="stzltable"
              ref="tableRef"
              :columns="columns6"
              :fetch="fetch6"
              :toolbar="toolbar"
              :operate="operate"
              :param="state.param"
              :pagination="pagination"
            >
            </pro-table>
          </a-card>
        </a-col>
      </a-tab-pane>
      <a-tab-pane key="7" tab="安全管理">
        <a-col :span="24">
          <a-card>
            <pro-table
              id="aqgltable"
              ref="tableRef"
              :columns="columns7"
              :fetch="fetch7"
              :toolbar="toolbar"
              :operate="operate"
              :param="state.param"
              :pagination="pagination"
            >
            </pro-table>
          </a-card>
        </a-col>
      </a-tab-pane>
    </a-tabs>
    <save :visible="state.visibleSave" @close="closeSave" :record="state.recordSave"></save>
    <edit :visible="state.visibleEdit" @close="closeEdit" :record="state.recordEdit"></edit>
    <upload :visible="state.visibleUpload" @close="closeUpload" :record="state.recordUpload"></upload>
  </page-layout>
</template>
<script>
import {reactive, ref, h} from 'vue';
import {message} from "ant-design-vue";
import {dataList, remove} from "@/api/module/commonProblem";
import save from "./modal/save";
import edit from "./modal/edit";
import upload from "./modal/upload";
import $ from "jquery";

const removeKey = "remove";
const removeBatchKey = "removeBatch";

var typeKey = 1;

export default {
  components: {
    save,
    edit,
    upload
  },
  mounted(){
    window.openLayerTips = this.openLayerTips
  },
  methods: {
    openLayerTips(text, id){
      var layui = window.layui;
      var layer;
      layui.use(() => {
        layer = layui.layer;
      })
      layer.tips(text, "#"+ id, {tips: 1});
    }
  },
  setup(){
    const tableRef = ref();

    const change = function (activeKey){
      typeKey = activeKey;
    }

    /// 删除配置
    const removeMethod = (record) => {
      message.loading({ content: "提交中...", key: removeKey });
      remove({ "id": record.id }).then((response) => {
        if (response.success) {
          message.success({ content: "删除成功", key: removeKey, duration: 1 }).then(() => {
            tableRef.value.reload()
          })
        } else {
          message.error({ content: "删除失败", key: removeKey, duration: 1 })
        }
      })
    }

    const columns1 = [
      {title: '清单序号', dataIndex: 'xuhao', key: 'xuhao', width: 90, fixed: 'left',},
      {title: '问题描述', dataIndex: 'wtmshu', key: 'wtmshu', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
        return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtmshu"+ index +"')", id: "wtmshu"+ index, style: "cursor: pointer;"}, text);
      }},
      {title: '相关法规标准', dataIndex: 'xgfgbzhui', key: 'xgfgbzhui', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
        return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'xgfgbzhui"+ index +"')", id: "xgfgbzhui"+ index, style: "cursor: pointer;"}, text);
      }},
      {title: '法规标准内容', dataIndex: 'fgbznrong', key: 'fgbznrong', ellipsis: true, customRender: ({ text, record, index }) => {
        let replaceText;
        if (null != text){
          replaceText = text.replaceAll("\n", "<br>");
        }
        return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'fgbznrong"+ index +"')", id: "fgbznrong"+ index, style: "cursor: pointer;"}, text);
      }},
      {title: "问题分类", children: [{
          title: '一般',
          dataIndex: 'wtflyban',
          key: 'wtflyban',
          width: 90
        }, {
          title: '较重',
          dataIndex: 'wtfljzhong',
          key: 'wtfljzhong',
          width: 90
        }, {
          title: '严重',
          dataIndex: 'wtflyzhong',
          key: 'wtflyzhong',
          width: 90, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtflyzhong"+ index +"')", id: "wtflyzhong"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: "责任主体", children: [{
          title: '单位1',
          dataIndex: 'zrzti1',
          key: 'zrzti1',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti1"+ index +"')", id: "zrzti1"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位2',
          dataIndex: 'zrzti2',
          key: 'zrzti2',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti2"+ index +"')", id: "zrzti2"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位3',
          dataIndex: 'zrzti3',
          key: 'zrzti3',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti3"+ index +"')", id: "zrzti3"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位4',
          dataIndex: 'zrzti4',
          key: 'zrzti4',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti4"+ index +"')", id: "zrzti4"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: '备注', dataIndex: 'bzhu', key: 'bzhu', width: 70},
    ]

    const columns2 = [
      {title: '清单序号', dataIndex: 'xuhao', key: 'xuhao', width: 90, fixed: 'left',},
      {title: '问题描述', dataIndex: 'wtmshu', key: 'wtmshu', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtmshu"+ index +"')", id: "wtmshu"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '相关法规标准', dataIndex: 'xgfgbzhui', key: 'xgfgbzhui', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'xgfgbzhui"+ index +"')", id: "xgfgbzhui"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '法规标准内容', dataIndex: 'fgbznrong', key: 'fgbznrong', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'fgbznrong"+ index +"')", id: "fgbznrong"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: "问题分类", children: [{
          title: '一般',
          dataIndex: 'wtflyban',
          key: 'wtflyban',
          width: 90
        }, {
          title: '较重',
          dataIndex: 'wtfljzhong',
          key: 'wtfljzhong',
          width: 90
        }, {
          title: '严重',
          dataIndex: 'wtflyzhong',
          key: 'wtflyzhong',
          width: 90, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtflyzhong"+ index +"')", id: "wtflyzhong"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: "责任主体", children: [{
          title: '单位1',
          dataIndex: 'zrzti1',
          key: 'zrzti1',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti1"+ index +"')", id: "zrzti1"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位2',
          dataIndex: 'zrzti2',
          key: 'zrzti2',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti2"+ index +"')", id: "zrzti2"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位3',
          dataIndex: 'zrzti3',
          key: 'zrzti3',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti3"+ index +"')", id: "zrzti3"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位4',
          dataIndex: 'zrzti4',
          key: 'zrzti4',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti4"+ index +"')", id: "zrzti4"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: '备注', dataIndex: 'bzhu', key: 'bzhu', width: 70},
    ]
    const columns3 = [
      {title: '清单序号', dataIndex: 'xuhao', key: 'xuhao', width: 90, fixed: 'left',},
      {title: '问题描述', dataIndex: 'wtmshu', key: 'wtmshu', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtmshu"+ index +"')", id: "wtmshu"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '相关法规标准', dataIndex: 'xgfgbzhui', key: 'xgfgbzhui', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'xgfgbzhui"+ index +"')", id: "xgfgbzhui"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '法规标准内容', dataIndex: 'fgbznrong', key: 'fgbznrong', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'fgbznrong"+ index +"')", id: "fgbznrong"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: "问题分类", children: [{
          title: '一般',
          dataIndex: 'wtflyban',
          key: 'wtflyban',
          width: 90
        }, {
          title: '较重',
          dataIndex: 'wtfljzhong',
          key: 'wtfljzhong',
          width: 90
        }, {
          title: '严重',
          dataIndex: 'wtflyzhong',
          key: 'wtflyzhong',
          width: 90, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtflyzhong"+ index +"')", id: "wtflyzhong"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: "责任主体", children: [{
          title: '单位1',
          dataIndex: 'zrzti1',
          key: 'zrzti1',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti1"+ index +"')", id: "zrzti1"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位2',
          dataIndex: 'zrzti2',
          key: 'zrzti2',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti2"+ index +"')", id: "zrzti2"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位3',
          dataIndex: 'zrzti3',
          key: 'zrzti3',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti3"+ index +"')", id: "zrzti3"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位4',
          dataIndex: 'zrzti4',
          key: 'zrzti4',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti4"+ index +"')", id: "zrzti4"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: '备注', dataIndex: 'bzhu', key: 'bzhu', width: 70},
    ]
    const columns4 = [
      {title: '清单序号', dataIndex: 'xuhao', key: 'xuhao', width: 90, fixed: 'left',},
      {title: '问题描述', dataIndex: 'wtmshu', key: 'wtmshu', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtmshu"+ index +"')", id: "wtmshu"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '相关法规标准', dataIndex: 'xgfgbzhui', key: 'xgfgbzhui', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'xgfgbzhui"+ index +"')", id: "xgfgbzhui"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '法规标准内容', dataIndex: 'fgbznrong', key: 'fgbznrong', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'fgbznrong"+ index +"')", id: "fgbznrong"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: "问题分类", children: [{
          title: '一般',
          dataIndex: 'wtflyban',
          key: 'wtflyban',
          width: 90
        }, {
          title: '较重',
          dataIndex: 'wtfljzhong',
          key: 'wtfljzhong',
          width: 90
        }, {
          title: '严重',
          dataIndex: 'wtflyzhong',
          key: 'wtflyzhong',
          width: 90, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtflyzhong"+ index +"')", id: "wtflyzhong"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: "责任主体", children: [{
          title: '单位1',
          dataIndex: 'zrzti1',
          key: 'zrzti1',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti1"+ index +"')", id: "zrzti1"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位2',
          dataIndex: 'zrzti2',
          key: 'zrzti2',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti2"+ index +"')", id: "zrzti2"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位3',
          dataIndex: 'zrzti3',
          key: 'zrzti3',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti3"+ index +"')", id: "zrzti3"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位4',
          dataIndex: 'zrzti4',
          key: 'zrzti4',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti4"+ index +"')", id: "zrzti4"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: '备注', dataIndex: 'bzhu', key: 'bzhu', width: 70},
    ]
    const columns5 = [
      {title: '清单序号', dataIndex: 'xuhao', key: 'xuhao', width: 90, fixed: 'left',},
      {title: '问题描述', dataIndex: 'wtmshu', key: 'wtmshu', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtmshu"+ index +"')", id: "wtmshu"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '相关法规标准', dataIndex: 'xgfgbzhui', key: 'xgfgbzhui', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'xgfgbzhui"+ index +"')", id: "xgfgbzhui"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '法规标准内容', dataIndex: 'fgbznrong', key: 'fgbznrong', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'fgbznrong"+ index +"')", id: "fgbznrong"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: "问题分类", children: [{
          title: '一般',
          dataIndex: 'wtflyban',
          key: 'wtflyban',
          width: 90
        }, {
          title: '较重',
          dataIndex: 'wtfljzhong',
          key: 'wtfljzhong',
          width: 90
        }, {
          title: '严重',
          dataIndex: 'wtflyzhong',
          key: 'wtflyzhong',
          width: 90, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtflyzhong"+ index +"')", id: "wtflyzhong"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: "责任主体", children: [{
          title: '单位1',
          dataIndex: 'zrzti1',
          key: 'zrzti1',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti1"+ index +"')", id: "zrzti1"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位2',
          dataIndex: 'zrzti2',
          key: 'zrzti2',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti2"+ index +"')", id: "zrzti2"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位3',
          dataIndex: 'zrzti3',
          key: 'zrzti3',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti3"+ index +"')", id: "zrzti3"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位4',
          dataIndex: 'zrzti4',
          key: 'zrzti4',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti4"+ index +"')", id: "zrzti4"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: '备注', dataIndex: 'bzhu', key: 'bzhu', width: 70},
    ]
    const columns6 = [
      {title: '清单序号', dataIndex: 'xuhao', key: 'xuhao', width: 90, fixed: 'left',},
      {title: '问题描述', dataIndex: 'wtmshu', key: 'wtmshu', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtmshu"+ index +"')", id: "wtmshu"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '相关法规标准', dataIndex: 'xgfgbzhui', key: 'xgfgbzhui', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'xgfgbzhui"+ index +"')", id: "xgfgbzhui"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '法规标准内容', dataIndex: 'fgbznrong', key: 'fgbznrong', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'fgbznrong"+ index +"')", id: "fgbznrong"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: "问题分类", children: [{
          title: '一般',
          dataIndex: 'wtflyban',
          key: 'wtflyban',
          width: 90
        }, {
          title: '较重',
          dataIndex: 'wtfljzhong',
          key: 'wtfljzhong',
          width: 90
        }, {
          title: '严重',
          dataIndex: 'wtflyzhong',
          key: 'wtflyzhong',
          width: 90, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtflyzhong"+ index +"')", id: "wtflyzhong"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: "责任主体", children: [{
          title: '单位1',
          dataIndex: 'zrzti1',
          key: 'zrzti1',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti1"+ index +"')", id: "zrzti1"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位2',
          dataIndex: 'zrzti2',
          key: 'zrzti2',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti2"+ index +"')", id: "zrzti2"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位3',
          dataIndex: 'zrzti3',
          key: 'zrzti3',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti3"+ index +"')", id: "zrzti3"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位4',
          dataIndex: 'zrzti4',
          key: 'zrzti4',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti4"+ index +"')", id: "zrzti4"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: '备注', dataIndex: 'bzhu', key: 'bzhu', width: 70},
    ]
    const columns7 = [
      {title: '清单序号', dataIndex: 'xuhao', key: 'xuhao', width: 90, fixed: 'left',},
      {title: '问题描述', dataIndex: 'wtmshu', key: 'wtmshu', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtmshu"+ index +"')", id: "wtmshu"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '相关法规标准', dataIndex: 'xgfgbzhui', key: 'xgfgbzhui', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'xgfgbzhui"+ index +"')", id: "xgfgbzhui"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: '法规标准内容', dataIndex: 'fgbznrong', key: 'fgbznrong', ellipsis: true, customRender: ({ text, record, index }) => {
          let replaceText;
          if (null != text){
            replaceText = text.replaceAll("\n", "<br>");
          }
          return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'fgbznrong"+ index +"')", id: "fgbznrong"+ index, style: "cursor: pointer;"}, text);
        }},
      {title: "问题分类", children: [{
          title: '一般',
          dataIndex: 'wtflyban',
          key: 'wtflyban',
          width: 90
        }, {
          title: '较重',
          dataIndex: 'wtfljzhong',
          key: 'wtfljzhong',
          width: 90
        }, {
          title: '严重',
          dataIndex: 'wtflyzhong',
          key: 'wtflyzhong',
          width: 90, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'wtflyzhong"+ index +"')", id: "wtflyzhong"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: "责任主体", children: [{
          title: '单位1',
          dataIndex: 'zrzti1',
          key: 'zrzti1',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti1"+ index +"')", id: "zrzti1"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位2',
          dataIndex: 'zrzti2',
          key: 'zrzti2',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti2"+ index +"')", id: "zrzti2"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位3',
          dataIndex: 'zrzti3',
          key: 'zrzti3',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti3"+ index +"')", id: "zrzti3"+ index, style: "cursor: pointer;"}, text);
          }
        }, {
          title: '单位4',
          dataIndex: 'zrzti4',
          key: 'zrzti4',
          width: 95, ellipsis: true, customRender: ({ text, record, index }) => {
            let replaceText;
            if (null != text){
              replaceText = text.replaceAll("\n", "<br>");
            }
            return h('span', {onclick: "openLayerTips('"+ replaceText +"', 'zrzti4"+ index +"')", id: "zrzti4"+ index, style: "cursor: pointer;"}, text);
          }
        }]},
      {title: '备注', dataIndex: 'bzhu', key: 'bzhu', width: 70},
    ]

    /// 数据来源 [前期与设计]
    const fetch1 = async (param) => {
      param = {type: 1};
      var response = await dataList(param);
      return {
        data: response.data.record,
      };
    };
    /// 数据来源 [建设管理]
    const fetch2 = async (param) => {
      param = {type: 2};
      var response = await dataList(param);
      return {
        data: response.data.record,
      };
    };
    /// 数据来源 [计划下达与执行]
    const fetch3 = async (param) => {
      param = {type: 3};
      var response = await dataList(param);
      return {
        data: response.data.record,
      };
    };
    /// 数据来源 [资金使用与管理]
    const fetch4 = async (param) => {
      param = {type: 4};
      var response = await dataList(param);
      return {
        data: response.data.record,
      };
    };
    /// 数据来源 [质量管理行为]
    const fetch5 = async (param) => {
      param = {type: 5};
      var response = await dataList(param);
      return {
        data: response.data.record,
      };
    };
    /// 数据来源 [实体质量]
    const fetch6 = async (param) => {
      param = {type: 6};
      var response = await dataList(param);
      return {
        data: response.data.record,
      };
    };
    /// 数据来源 [安全管理]
    const fetch7 = async (param) => {
      param = {type: 7};
      var response = await dataList(param);
      return {
        data: response.data.record,
      };
    };


    /// 工具栏
    const toolbar = [
      { label: "新增", code:"cjwt:save", event: function () {
        state.visibleSave = true,
        state.recordSave = {type: typeKey}
      }},
      { label: "导入", code:"cjwt:update", event: function () {
        state.visibleUpload = true,
        state.recordUpload = {type: typeKey}
      }}
    ];

    /// 行操作
    const operate = [
      { label: "修改", code:"cjwt:update", event: function (record) { state.visibleEdit = true, state.recordEdit = record}},
      { label: "删除",isDel:true,  code:"cjwt:delete", delEvent: function (record) { removeMethod(record) }},
    ];

    /// 分页参数
    const pagination = false;

    /// 外置参数 - 当参数改变时, 重新触发 fetch 函数
    const state = reactive({
      param: {},
      visibleSave: false,
      visibleEdit: false,
      visibleUpload: false,
      recordSave: {},
      recordEdit: {},
      recordUpload: {},

    })

    /// 查询参数
    const searchParam = [
      { key: "xuhao", type: "input", label: "清单序号"},
      { key: "wtmshu", type: "input", label: "问题描述"},
      { key: "xgfgbzhui", type: "input", label: "相关法规标准"},
      { key: "fgbznrong", type: "input", label: "法规标准内容"},
      { key: "wtflyban", type: "input", label: "一般"},
      { key: "wtfljzhong", type: "input", label: "较重"},
      { key: "wtflyzhong", type: "input", label: "严重"},
      { key: "zrzti1", type: "input", label: "责任主体1"},
      { key: "zrzti2", type: "input", label: "责任主体2"},
      { key: "zrzti3", type: "input", label: "责任主体3"},
      { key: "zrzti4", type: "input", label: "责任主体4"},
      { key: "bzhu", type: "input", label: "备注"},
    ]

    /// 查询操作
    const search = function(value) {
      state.param = value
      tableRef.value.reload()
    }

    const closeSave = function(){
      state.visibleSave = false;
      tableRef.value.reload();
    }

    const closeEdit = function(){
      state.visibleEdit = false;
      tableRef.value.reload();
    }

    const closeUpload = function(){
      state.visibleUpload = false
      tableRef.value.reload()
    }

    return {
      activeKey: ref('1'),
      change,

      state,
      searchParam,
      search,
      pagination,

      columns1,
      columns2,
      columns3,
      columns4,
      columns5,
      columns6,
      columns7,
      toolbar,
      operate,
      fetch1,
      fetch2,
      fetch3,
      fetch4,
      fetch5,
      fetch6,
      fetch7,

      closeSave,
      closeEdit,
      closeUpload,

      tableRef,
    };
  }
}
</script>
<style>
  .layui-layer-tips{
    word-break: break-all;
    word-wrap: break-word;
  }
</style>
